import React, { Component } from 'react'
import './index.css'
export default class Swipper extends Component {
    state = {
        index: 1
    }
    render() {
        let {index} = this.state;
        return (
            <div className="wrapped">
                <img src={require(`../assets/imgs/${index}.webp`)} alt="" />
                <span onClick={()=>{
                    /* 数据驱动视图 */
                    index--;
                    if(index <= 0) index = 4;
                    this.setState({
                        index
                    })
                }}  className="btn">&lt;</span>
                <span onClick={()=>{
                    index++
                    if(index >= 5) index = 1;
                    this.setState({
                        index
                    })
                }} className="btn right">&gt;</span>
            </div>
        )
    }
}
